<g:render template="/home/header" ></g:render>
<!--主体-->
%{--<script>
    $(window).unload( function () { alert("Bye now!"); } );
</script>--}%
<script type="text/javascript" src="${resource(dir:'/js',file:'jquery.selectPicker.js')}"></script>
<script>
    (function($) {
        $(".selectPicker").selectPicker({
            width: 700, height: 500
        });
        $(".chosen-select").chosen();
        $('#form').ajaxForm({
            beforeSubmit: function() {
                $("#form").jqFormClearErr();
                $("#form").find("input[type=submit]").attr("disabled", true);
            },
            success: function(response) {
                var userId = response.userId;
                $("#form").find("input[type=submit]").attr("disabled", false);
                $("#form").jqFormResponse({
                    response: response,
                    successUri: "<g:createLink action='success'/>"+"?userId=" + userId
                });

            },
            error: function() {
                $("#form").find("input[type=submit]").attr("disabled", false);
            }
        });

    }(jQuery));

    function submitData(){

        var oldPassword = $("#form-password").val();

        var newPassword = $("#form-newPassword").val();
        var passwordConfirm = $("#form-passwordConfirm").val();
        var submit = {oldPassword:oldPassword,newPassword:newPassword,passwordConfirm:passwordConfirm};

        var url = '<g:createLink controller="member" action="updatePassword"/>';
        $.post(url,submit,function(data){
            alert(data.message);
            clear();
        },'JSON');

    }
    function clear(){
        $("#form-password").val("");
        $("#form-newPassword").val("");
        $("#form-passwordConfirm").val("");
    }

    function updateCity(){
        var provinceId = $("#form-province").val();
        jQuery.ajax({
            type:'POST',
            data:'provinceId='+provinceId,
            url:'/photobox/member/listByCity',
            success:function(data,textStatus){
                console.log(data);
                jQuery('#city').html(data);
            },
            error:function(XMLHttpRequest,textStatus,errorThrown){
            }
        });
        jQuery('#form-district').html('<select><option value="">--请选择--</option></select>');
    }

    $(function(){
        var oTnav = $('#tab_nav1 li');
        var oTcon = $('#tab_blk1 .tab_blk1_1');
        
        oTnav.click(function(){
            if(is_form_changed()||sexR!=$(".canGoR:checked").val()) {
                if(!confirm("您的修改内容还没有保存，您确定离开吗？")){
                    return;
                }
            }
            setData();
            $(this).addClass('hit').siblings().removeClass('hit');
            var index = $(this).index();
            oTcon.eq(index).show().siblings().hide();
        });
    });

    function is_form_changed() {
        var is_changed = false;
        $(".canGo").each(function() {
            var _v = $(this).attr('_value');
            if(typeof(_v) == 'undefined') _v = '';
            if(_v != $(this).val()) {
                is_changed = true;
            }
        });
        return is_changed;
    }

    var sexR = "";
    var isClear=false;

    $(window).bind('beforeunload', function(){
        if(is_form_changed()||sexR!=$(".canGoR:checked").val()) {
            return "您的修改内容还没有保存，您确定离开吗？";
        }
    });

    var setData=function() {
        $(".canGo").each(function() {
            $(this).attr('_value', $(this).val());
        });
    }

    $(document).ready(function(){
        sexR = $(".canGoR:checked").val();
        setData();
    });

    function checkId(){
        var idCard = $("#form-idCardNo").val();
        if(idCard.length>18 || idCard.length<15){
            alert("身份证号码位数有误");
        }
    }
</script>
<div class="wid_1200 mTo_20">
    <div class="left_blk f_l bor1">
        <!--nav-->
        <h4 class="nav_s_tit">
            <div class="nav_name f_l">账号设置：</div><div class="triangle-right f_r"></div>
        </h4>
        <ul class="nav_ul"  id="tab_nav1">
            <li class="hit"><span class="tubiao2">&nbsp;</span><a href="###" style="text-indent:30px">完善个人资料</a></li>
            <li><span class="tubiao2">&nbsp;</span><a href="###" style="text-indent:30px">修改头像</a></li>
            <li><span class="tubiao2">&nbsp;</span><a href="###" style="text-indent:30px">修改密码</a></li>
        </ul>
        <!--/nav-->
    </div>

    <!--blk3-->
    <div class="blk3 f_r">


        <div class="s1_title mLe_20">
            <h3 class="f_l" style=" text-indent:0">基本信息</h3>
        </div>
     <div class="blk3_1 f_l" id="tab_blk1">

     %{--<g:render template="form_p" model="[ url: createLink(action: 'update', params:[format: 'json',user:user]) ]"></g:render>--}%
         <!--完善个人资料-->
         <div class="tab_blk1_1 pLe_30" style="display:block;">

             <div class="row">
                 <div class="col-xs-12">
                     <g:form id="form" useToken="true" controller="member" action="update" class="form-horizontal" role="form">
                         <input type="hidden" class="input-value" name="id"  value="${user?.id}"/>
                         <div class="form-group  message col-xs-12">

                         </div>
                         <div class="form-group form-field field-username">
                             <label class="col-sm-3 control-label no-padding-right" for="form-username"> 用户名: </label>
                             <div class="col-sm-4">
                                 <g:textField  name="username" id="form-username" value="${user?.username}" placeholder="输入用户名" class="width-100 canGo" />
                             </div>
                             <div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>
                         </div>

                         <div class="form-group form-field field-realName">
                             <label class="col-sm-3 control-label no-padding-right" for="form-realName"> 真实姓名: </label>
                             <div class="col-sm-4">
                                 <g:textField  name="realName" id="form-realName" value="${user?.realName}" placeholder="输入真实姓名" class="width-100 canGo" />
                             </div>
                             <div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>
                         </div>

                         <div class="form-group form-field field-isPhotographer">
                             <label class="col-sm-3 control-label no-padding-right" for="form-isPhotographer"> 账号类型: </label>
                             <div class="col-sm-4" id="form-isPhotographer">
                                 <g:if test="${user.isPhotographer == 1}">
                                     摄影师
                                 </g:if>
                                 <g:else>
                                     非摄影师
                                 </g:else>
                             </div>
                             <div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>
                         </div>

                         <div class="form-group form-field field-gender">
                             <label class="col-sm-3 control-label no-padding-right" for="form-gender"> 性别: </label>
                             <div class="col-sm-4">
                                 <g:radio name="gender" id="form-gender" value="0" checked="${user?.gender == 0}" class="canGoR"></g:radio>男
                                 <g:radio name="gender" value="1" checked="${user?.gender == 1}" class="canGoR"></g:radio>女
                             </div>
                             <div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>
                         </div>

                         <div class="form-group form-field field-province">
                             <label class="col-sm-3 control-label no-padding-right" for="form-province"> 省份: </label>
                             <div class="col-sm-4">
                                 <g:select name="province" id="form-province" optionKey="id" optionValue="name" value="${user?.address[0]?.province?.id}" class="width-50 canGo"
                                           noSelection="${['':'--请选择--']}" from="${provinceList}"
                                           onchange="updateCity();">
                                 </g:select>省
                             </div>
                             <div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>
                         </div>

                         <div class="form-group form-field field-city">
                             <label class="col-sm-3 control-label no-padding-right" for="form-city"> 城市: </label>
                             <div class="col-sm-4">
                                 <div id="city">
                                     <g:select name="city" id="form-city" optionKey="id" optionValue="name" value="${user?.address[0]?.city?.id}" class="width-50 canGo"
                                               noSelection="${['':'--请选择--']}" from="${cityList}"
                                               onchange="${remoteFunction(controller: 'member', action: 'listByDistrict', params: '\'cityId=\'+this.value', update: 'district')}">
                                     </g:select>市
                                 </div>
                             </div>
                             <div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>
                         </div>

                         <div class="form-group form-field field-district">
                             <label class="col-sm-3 control-label no-padding-right" for="form-district"> 区(县): </label>
                             <div class="col-sm-4">
                                 <div id="district">
                                     <g:select name="district" id="form-district" optionKey="id" optionValue="name" value="${user?.address[0]?.district?.id}" class="width-50 canGo"
                                               noSelection="${['':'--请选择--']}" from="${districtList}">
                                     </g:select>区(县)
                                 </div>
                             </div>
                             <div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>
                         </div>


                         <div class="form-group form-field field-address">
                             <label class="col-sm-3 control-label no-padding-right" for="form-address"> 详细地址: </label>
                             <div class="col-sm-4">
                                 <g:textArea rows="5" cols="40"  name="address" id="form-address" value="${user?.address[0]?.address}" placeholder="详细地址" class="width-100 canGo"/>
                             </div>
                             <div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>
                         </div>

                         <div class="form-group form-field field-postCode">
                             <label class="col-sm-3 control-label no-padding-right" for="form-postCode"> 邮编: </label>
                             <div class="col-sm-4">
                                 <g:textField  name="postCode" id="form-postCode" value="${user?.address[0]?.postCode}" placeholder="邮编" class="width-30 canGo"/>
                             </div>
                             <div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>
                         </div>

                         <div class="form-group form-field field-idCardNo">
                             <label class="col-sm-3 control-label no-padding-right" for="form-idCardNo"> 身份证号码: </label>
                             <div class="col-sm-4">
                                 <g:textField  name="idCardNo" id="form-idCardNo" value="${user?.idCardNo}" placeholder="身份证号码" class="width-100 canGo" onblur="checkId()"/>
                             </div>
                             <div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>
                         </div>

                         <div class="form-group form-field field-presentation">
                             <label class="col-sm-3 control-label no-padding-right" for="form-presentation"> 自我介绍: </label>
                             <div class="col-sm-4">
                                 <g:textArea rows="5" cols="40" maxlength="300" name="presentation" id="form-presentation" value="${user?.presentation}" placeholder="输入自我介绍(300字以内)" class="width-100 canGo"/>
                             </div>
                             <div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>
                         </div>
                         <div class="clearfix form-actions">
                             <div class="col-md-offset-3 col-md-9">
                                 <button  style="padding: 0 10px;"class="annui annui1" type="submit"  id="sureUpdate" onclick="checkBind()">
                                     <i class="icon-ok bigger-110"></i>
                                     确认保存
                                 </button>
                             </div>
                         </div>
                     </g:form>
                 </div>
             </div>
         </div>
         <script type="text/javascript" src="${resource(dir:'/photobox',file:'ajaxfileupload.js')}"></script>
         <script type="text/javascript">
             var checkBind= function () {
                 $(window).unbind('beforeunload');
             }

             $(function () {
                 $("#fileUploadButton").click(function () {
                     if ($("#file1").val().length > 0) {
                         ajaxFileUpload();

                     }
                     else {
                         alert("请选择图片");
                     }
                 })
             })
             function ajaxFileUpload() {
                 $.ajaxFileUpload
                 (
                         {
                             url:"<g:createLink controller="member" action="saveIocn"/>", //用于文件上传的服务器端请求地址
                             secureuri: false, //一般设置为false
                             fileElementId: 'file1', //文件上传空间的id属性  <input type="file" id="file" name="file" />
                             dataType: 'JSON', //返回值类型 一般设置为json
                             success: function (data, status)  //服务器成功响应处理函数
                             {
                                 $("#photo_id").attr("src", '../'+ data.img)
                                 $("#iocn_path").val(data.img)
                                 $("#img1").attr("src", data);
                                 if (typeof (data.error) != 'undefined') {
                                     if (data.error != '') {
                                         alert(data.error);
                                     } else {
                                         alert(data.msg);
                                     }
                                 }
                             },
                             error: function (data, status, e)//服务器响应失败处理函数
                             {
                                 alert(e);
                             }
                         }
                 )
                 return false;
             }

         </script>
         <!--/完善个人资料-->
         <!--修改头像-->
         <div class="tab_blk1_1 pLe_30" style="display:none;">
             <div class="form-group  message col-xs-12">

             </div>
             <div class="kong_20"></div>
             <div >上传头像</div>
             <div class="f_l mRi_30" style="border-right: 1px solid #ddd; height: 300px; width:300px; padding-left: 20px;">
                 <div class="xuanze_btnqu"><p class="xuanze_btn"><input type="file" id="file1" name="file" /></p></div>
                 <div class="xuanze_upload"><p><input id="fileUploadButton" type="button" value="上传" class="tishi_btn2" /></p></div>
                 <input type="hidden" id="iocn_path" name="iocn_path" value="" />
                 <p>请上传140*140大小图片</p>
             </div>

             <div class="xuanze_yulan f_l">
                 <img style="width: 130px; height: 130px;" id="photo_id" src="http://a.hiphotos.baidu.com/image/h%3D1050%3Bcrop%3D0%2C0%2C1680%2C1050/sign=00ad5dc433adcbef1e347a06999f15be/1c950a7b02087bf4dade33e9f0d3572c11dfcf84.jpg" >
             </div>
         </div>
         <!--/修改头像-->

         <!--修改密码-->
         <input type="hidden" class="input-value" name="id" id="id" value="${user?.id}"/>
         <input type="hidden" name="xx">
         <div class="tab_blk1_1 pLe_30" style="display:none;">
             <div class="form-group  message col-xs-12">

             </div>
             <div class="kong_20"></div>
             <input type="hidden" class="input-value" name="id"  value="${user?.id}"/>
             <div class="form-group form-field field-password">
                 <label class="col-sm-3 control-label no-padding-right f_l textR" for="form-password"> 旧&nbsp;&nbsp;密&nbsp;&nbsp;码: </label>
                 <div class="col-sm-4 zc_Rtxt f_l">
                     <g:passwordField  name="password" id="form-password" placeholder="请输入旧密码" class="width-100" />
                 </div>
                 <div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>
             </div>
             <div class="form-group form-field field-newPassword">
                 <label class="col-sm-3 control-label no-padding-right f_l textR" for="form-newPassword"> 新&nbsp;&nbsp;密&nbsp;&nbsp;码: </label>
                 <div class="col-sm-4 zc_Rtxt f_l">
                     <g:passwordField  name="newPassword" id="form-newPassword" placeholder="请输入新密码" class="width-100" />
                 </div>
                 <div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>
             </div>
             <div class="form-group form-field field-passwordConfirm">
                 <label class="col-sm-3 control-label no-padding-right f_l textR" for="form-passwordConfirm"> 确认密码: </label>
                 <div class="col-sm-4 zc_Rtxt">
                     <g:passwordField  name="passwordConfirm" id="form-passwordConfirm" placeholder="请再次输入密码" class="width-100" />
                 </div>
                 <div class="help-block col-xs-12 col-sm-reset inline fieldMsg">  </div>
             </div>
             <div class="clearfix form-actions clear">
                 <div class="col-md-offset-3 col-md-9">
                     <button  style="padding: 0 10px;"class="annui annui1"type="button" onclick="submitData();">
                         <i class="icon-ok bigger-110"></i>
                         确认
                     </button>
                 </div>
             </div>
         </div>
         <!--/修改密码-->


     </div>
    </div>
    <!--/blk3-->
</div>
<!--/主体-->

<g:render template="/home/footer" ></g:render>